<template>
	<view>
		
		
		<empty v-if="address_list.length == 0">没有任何收货地址</empty>
		
		
		<view v-if="address_list.length > 0" class="address" v-for="item in address_list">
			<view class="address_info">
				<view class="left"><text class="iconfont icon-dizhi"></text></view>
				<view class="right">
					<view class="detail">{{ item.address }}</view>
					<view class="contact">{{ person(item.name, item.phone) }}</view>
				</view>
			</view>
			<view class="common">
				<label class="radio" @click="setDefaultAddress(item.id)">
					
					<radio :checked="item.default === true" />
					
					<text>{{ item.default ? '默认地址' : '设为默认' }}</text>
				</label>

				<view class="action">
					<text class="edit" @click="toEditView(item.id)">编辑</text>
					<text class="delete" @click="del(item.id)">删除</text>
				</view>
			</view>
			
		</view>

		<view class="bottom_btn" @click="toAddressAdd">添加收货地址</view>
		
		
		
	</view>
</template>

<script>
import uniList from '@/components/uni-list/uni-list.vue';
import uniListItem from '@/components/uni-list-item/uni-list-item.vue';

import empty from '@/components/empty2';

export default {
	components: { uniList, uniListItem, empty },

	data() {
		return {
			default_address: '1',
			address_list: [
				{
					id: '0',
					name: '',
					phone: '',
					address: ''
				}
			]
		};
	},

	computed: {
		person() {
			return function(name, phone) {
				return name + ' ' + phone;
			};
		},
		name() {
			return this.data;
		}
	},

	onShow() {
		this.loadData();
	},

	onLoad() {},
	methods: {
		
		// 调为默认地址
		setDefaultAddress(address_id) {
		  this.$http.post('/shop.address/set_default', {
		    address_id: address_id
		  }).then(res => {
			  
		    if (res.data.data > 0) {
		       
			   this.loadData();
		      //this.$EventBus.$emit('address_update_success', 'ok');
		    }
		  });
		},
		
		toAddressAdd() {
			uni.navigateTo({
				url: 'addressAdd'
			});
		},

		// 删除地址
		del(address_id) {
			let that = this
			uni.showModal({
				title: '删除确认',
				content: '你确定删除该地址么？',
				success: function(res) {
					if (res.confirm) {
						that.delHandler(address_id);
					} else if (res.cancel) {
						//console.log('用户点击取消');
					}
				}
			});
		},
		delHandler(address_id) {
			this.$http
				.post('/shop.address/delete', {
					address_id: address_id
				})
				.then(res => {
					if (res.data.data > 0) {
						uni.showToast({
							title: '删除成功'
						});
						//this.$router.replace('/user/address')
						//this.$EventBus.$emit('address_update_success', 'ok');
						//this.address_list = splice(0, this.address_list.length);
						this.loadData();
					}
				});
		},
		// 打开编辑页面
		toEditView(id) {
			uni.navigateTo({
				url: 'addressEdit?id=' + id
			});
		},

		loadData() {
			this.$http.post('/shop.address/lists', {}).then(res => {
				this.address_list = res.data.data;
				for (var index in this.address_list) {
					if (this.address_list[index].default === true) {
						this.default_address = this.address_list[index].id;
					}
				}
			});
		}
	}
};
</script>

<style lang="scss">
.bottom_btn {
	background-color: $colorPrimary;
	color: white;
	position: fixed;
	bottom: 0;
	width: 100%;
	height: 80rpx;
	text-align: center;
	line-height: 80rpx;
}

.address {
	background-color: white;
	border-bottom: 1px solid #e4e3e6;
	.address_info {
		padding: 30rpx;
		border-bottom: 1px solid #f0eff1;
		display: flex;
		.left {
			width: 60rpx;
			display: flex;
			align-items: center;
			.iconfont {
				font-size: 40rpx;
			}
		}
		.right {
			flex: 1;
			.detail {
				margin-bottom: 20rpx;
			}
			.contact {
				font-size: 0.9em;
			}
		}
	}
	.common {
		padding: 30rpx;

		display: flex;
		justify-content: space-between;

		.edit {
			margin-right: 30rpx;
		}
	}
}
</style>
